<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
         * {
             margin: 0;
            padding: 0;
        }
       .bg{
            width: 984px;
            height: 617px;
            background: url(../images/bg.jpg) no-repeat;
            margin: 0 auto;
            padding-top: 10px;
           border-top: 8px solid #FFFFFF;
            
        }
        .head {
            width: 848px;
            height: 46px;
            background: url(../images/nav.png) no-repeat;
            padding: 40px 0 0 123px;
        }
        .head span {
            font-size: 16px;
            padding: 0 30px;
        }
        .float {
            float: left;
        }
        .more {
            margin-left: 240px;
        }
        .new {
            width: 984px;
            height: 300px;
            
            margin: 18px auto;
            padding-top: 120px;  
        }
        .new1 {
            width: 294;
            height: 256px;
            float: left;
            margin-left: 29px;
        }
        .one {
            width:284 ;
            height: 50px;
            padding-left: 10px;
            font-size: 16px;
            border-bottom: 1px solid #ddd;
            font-weight: bold;
            line-height: 50px; 
        }
        .two {
            width: 284px;
            height: 70px;
            line-height: 20px;
            padding: 10px 0 0 10px;
            font-size: 12px;
            color: #BBBBBB;
        }
        .shadow {
            border-bottom: 2px solid #ddd;
        }
        .new2 {
           width: 294;
            height: 256px;
            float: left;
            margin-left: 29px; 
        }
        .new3 {
            width: 294;
            height: 256px;
            float: left;
            margin-left: 29px; 
        }
       .xinsahng {
           width: 980px;
           height: 292px;
           margin:  0 auto;
           padding-top: 170px;
           background: url(../images/xinshang.jpg) no-repeat; 
        }
        .picture {
            letter-spacing: 70px;}
            .left {
            margin-left: 88px;
        }
        .footer {
            height: 80px;
            background:url(../images/footer_bg.jpg) repeat; 
            text-align: center;
            line-height: 80px;
            color: aliceblue;
        }
        .fixed {
            position: fixed;
            right: 5%;
            bottom: 5%;
        }
    </style>
</head>
<body>
    <div class="bg">
        <div class="head"> 
            <span class="float">网站首页</span>
            <span class="float">关于我们</span>
            <span class="float more">摄影作品</span>
            <span>联系我们</span>
            </div>
        </div>
        <div class="new">
           <div class="new1">
              <img src="news1.jpg" alt="">
               <h2 class="one">优惠活动</h2>
               <p class="two">新年订单有特大惊喜！</p >
               <p class="shadow"></p >
            </div>
            <div class="new2">
            <img src="news2.jpg" alt="">
                <h2 class="one">宝贝写真应注意什么</h2>
                <p class="two">孩子拍摄的时候如果是陌生人接触的话比较容易哭闹，如果换作是亲近或者平时比较熟悉玩得来的就会好很多。</p >
                <p class="shadow"></p >
            </div>
            <div class="new3">
            <img src="news3.jpg" alt="">
                <h2 class="one">宝贝庆生会</h2>
                <p class="two">为新宝宝准备的生日party，参与者可获得精美生日礼物一份。</p >
                <p class="shadow"></p >
            </div>
        </div>
        <div class="xinsahng">
            <div class="picture">
                <img src="img1.jpg" alt="" class="left">
                <img src="img2.jpg" alt="">
                <img src="img3.jpg" alt="">
                <img src="img4.jpg" alt="">
                </div>
            </div>
            <div class="footer">
            <p>青春树版权所有2000-2016京ICP备08001421号&nbsp;&nbsp;京公网安备110108007702</p >
            </div>
            <div class="fixed">
                <img src="erweima.png" alt="">
            </div>
</body>
</html>